<template>
  <div style="overflow: hidden;width:100%;height:100%;" id="xGridParent">
    <vxe-grid ref='xGrid' v-bind="GridEvent.grid_options">
      <template #toolbar_tools>
        <el-button type="primary" :size="size" icon="fa fa-plus" @click="GridEvent.newForm()"> 新增</el-button>
        <el-button type="primary" :size="size" icon="fa fa-edit (alias)" @click="editEvent()"> 编辑</el-button>
        <el-button type="primary" :size="size" icon="fa fa-trash-o" @click="deleteEvent()"> 删除</el-button>
        <el-button type="primary" :size="size" icon="vxe-button--icon fa fa-file-excel-o" @click="downloadXls()">
          模板下载
        </el-button>
        <el-button type="primary" :size="size" icon="vxe-button--icon fa fa-arrow-down" @click="exportWord()"> 导出
        </el-button>
        <el-upload
          name="file"
          class="upload-demo"
          :show-file-list="false"
          :http-request="GridEvent.importXls"
          :on-preview="GridEvent.uploadFile"
          :limit="1"
          accept=".xls,.xlsx"
        >
          <el-button type="primary" :size="size" icon="vxe-button--icon fa fa-arrow-up"> 导入</el-button>
          <!-- <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div> -->
        </el-upload>
        <!-- <el-button type="warning" :size="size" icon="fa fa-save (alias)" @click="exportWord()">导出</el-button> -->
        <!-- <el-button type="danger" :size="size" icon="fa fa-cog"> 设置x</el-button>
        <el-button type="primary" :size="size" icon="fa fa-upload"> 上传x</el-button> -->
      </template>
    </vxe-grid>
    <el-dialog v-dialogDrag :top="formModel.top"
               :title="formModel.title" :visible.sync="formModel.dialogVisible" :width="formModel.width"
               :closeOnClickModal="formModel.closeOnClickModal"
               :before-close="handleClose">
      <t-bizc-enery-equip-form v-if="formModel.dialogVisible && formModel.componentId=='TBizcEneryEquipForm' "
                               :formData="formModel.TBizcEneryEquipFormData"
                               @closeEvent="tBizcEneryEquipFormCloseEvent"></t-bizc-enery-equip-form>
      <!-- 其他的弹出组件可以写在这里面 -->
    </el-dialog>
  </div>
</template>

<script>
import {reactive} from 'vue'
import {formModel, GridEvent} from './model/tBizcEneryEquip-table.js'

export default {
  name: "tBizcEneryEquip",
  components: {
    TBizcEneryEquipForm: () => import("./components/tBizcEneryEquipForm.vue")
  },
  data() {
    return {
      size: "small",  //按钮尺寸大小//
      GridEvent: reactive(GridEvent),
      formModel: reactive(formModel),
    }
  },
  methods: {
    setTableHeight: function () { //高度自�?�应//
      const tableContainer = document.querySelector("#xGridParent");
      const height = tableContainer.clientHeight;
      this.GridEvent.grid_options.height = height - 5;
    },
    tBizcEneryEquipFormCloseEvent(reload) {  //form表单编辑窗口关闭事件//
      formModel.closeDialogEvent(reload, this.$refs.xGrid)
    },
    editEvent() {    //编辑事件//
      const rows = this.$refs.xGrid.getCheckboxRecords(true);
      if (rows && rows.length == 1) {
        GridEvent.editForm(rows[0]);
      } else {
        this.$message.warning("只能选中1行数据进行编辑")
      }
    },
    deleteEvent() {  //删除事件//
      const rows = this.$refs.xGrid.getCheckboxRecords(true);
      if (rows) {
        GridEvent.deleteEvent(rows, this.$refs.xGrid);
      }
    },
    exportWord() {//导出事件
      // alert('导出')
      GridEvent.exportXls(this.$refs.xGrid);
    },
    handlePreview(info) {//模板导入
      console.log(info, 'iiiiiii');
      // GridEvent.exportXls(info);
      // let formData = new FormData();
      // formData.append("file",info.file);
      // formData.append("type","bzyhk");
      // SupportpersonnelApi.importXls(formData).then(res=>{
      //   antd.message.success(res)
      // }).catch(err=>{
      //   console.log(err)
      // })
      // GridEvent.exportXls(this.$refs.xGrid);
    },
    downloadXls() {
      window.open(process.env.VUE_APP_APP_API + '/equip/export/downloadTemplate')
      console.log(process.env.VUE_APP_APP_API + '/equip/export/downloadTemplate', '地址');
    }
  },
  mounted() {
    this.$nextTick(function () {
      this.setTableHeight();
      GridEvent.getOptionData_yxzt(this.$refs.xGrid)
      GridEvent.getOptionData_sblxmc(this.$refs.xGrid)
      GridEvent.getOptionData_djhszt(this.$refs.xGrid)

    })
    window.addEventListener('resize', this.setTableHeight);
  },
  destroyed() {
    window.removeEventListener('resize', this.setTableHeight);
  },
}
</script>

<style scoped>
.upload-demo {
  display: inline;
  margin-left: 10px;
}

</style>

